<template>
  <view class="success-container">
    <!-- 导航栏 -->
    <u-navbar
      leftText="申请成功"
      left-icon="arrow-left"
      left-icon-color="#303133"
      bg-color="#ffffff"
      fixed
      placeholder
      @left-click="back"
    />

    <!-- 主要内容 -->
    <view class="content">
      <view class="success-icon">
        <u-icon name="/static/apply-success.png" size="80" color="#4CD964" />
      </view>
      <view class="success-title">申请成功</view>
      <view class="success-description">平台核对后即将打款至转出账户</view>
    </view>

    <!-- 返回按钮 -->
    <!-- <view class="btn-container">
      <u-button
        type="primary"
        :customStyle="{
          backgroundColor: '#1E88E5',
          color: '#ffffff',
          border: 'none',
          borderRadius: '45rpx',
          height: '90rpx',
          lineHeight: '90rpx',
          fontSize: '32rpx',
          marginTop: '60rpx'
        }"
        @click="backToAsset"
      >
        返回资产页
      </u-button>
    </view> -->
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { navigate as publicNavigate } from '@/utils/public.js';

const router = useRouter();

// 返回上一页
const back = () => {
  publicNavigate('back');
};

// 返回资产页
const backToAsset = () => {
  router.push('/pages/my/asset');
};
</script>

<style scoped>
.success-container {
  display: flex;
  flex-direction: column;
}

.content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30rpx;
  margin-top: 120rpx;
}

.success-icon {
  margin-bottom: 40rpx;
}

.success-title {
  font-size: 40rpx;
  color: #303133;
  margin-bottom: 20rpx;
  font-weight: bold;
}

.success-description {
  font-size: 28rpx;
  color: #909399;
  text-align: center;
  max-width: 600rpx;
}

.btn-container {
  padding: 30rpx;
}
</style>
